<template>
    <div>
        <page-main>
            <!-- 批量操作 -->
            <div style="margin-bottom: 20px;">
                <el-button type="primary" size="small" @click="add(null)">新建</el-button>
            </div>
            <!-- 表格 table -->
            <el-table ref="table" v-loading="loading" :data="dataList" border stripe highlight-current-row>
                <el-table-column prop="" label="序号" width="50px">
                    <template #default="scope">
                        <span>{{ scope.$index + 1 }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="name" label="规则名称">
                    <template #default="scope">
                        <el-button type="text" size="small" @click="add(scope.row)">{{ scope.row.name || '--' }}</el-button>
                    </template>
                </el-table-column>
                <el-table-column prop="status" label="状态" width="70px">
                    <template #default="scope">
                        <el-switch v-model="scope.row.status" active-value='1' inactive-value="0" active-color="#13ce66" inactive-color="#ff4949" @change="(e)=>statusChange(e,scope.row)" />
                    </template>
                </el-table-column>
                <el-table-column prop="sort" label="优先级" width="65px" />
                <el-table-column prop="dept_name" label="分公司名称" />
                <el-table-column prop="start_date" label="开始日期" />
                <el-table-column prop="end_date" label="结束日期" />
            </el-table>
        </page-main>
        <!-- 新建规则 -->
        <add-dialog ref="addDialog" @success="getList" />
    </div>
</template>
<script>
import { userRule, saveUserRule } from '@/api/gonghai'
import AddDialog from './components/AddDialog'
export default {
    components: {
        AddDialog
    },
    filters: {
        statusFilter(val) {
            const map = {
                1: '启用',
                0: '禁用'
            }
            return map[val] || '--'
        },
        daysTypeFilter(val) {
            const map = {
                1: '天',
                2: '周'
            }
            return map[val] || '--'
        }
    },
    data() {
        return {
            loading: false,
            dataList: []
        }
    },
    mounted() {
        this.getList();
    },
    methods: {
        getList() {
            this.loading = true;
            userRule().then(res => {
                this.dataList = res.data.list;
                this.loading = false;
            })
        },
        statusChange(e, item) {
            item.status = e;
            saveUserRule(item).then(res => {
                if (res.status == '1') {
                    this.$message.success('状态修改成功！')
                    this.getList();
                } else {
                    this.$message.error(res.message)
                }
            })
        },
        add(row) {
            this.$refs.addDialog.showDialog(row); 
        }
    }
}
</script>
